<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html; charset=utf-8" language="java" %>
<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
  <!-- 引入facicon.ico网页图标 -->
  <link rel="shortcut icon" href="../favicon.ico" type="image/x-icon" />
  <title>睿道商城</title>


  <!-- 引入detail的css 文件 -->
  <link rel="stylesheet" href="${pageContext.request.contextPath}/assets/css/detail.css">

  <jsp:include page="common.jsp"/>
</head>

<body>
  <!-- 头部 -->
  <jsp:include page="header.jsp"/>

  <!-- 主体 -->
  <section class="container">
    <div class="row product-content-container">
      <img class="col-md-4 col-md-offset-1 img-thumbnail" src="http://192.168.11.44:9090/${product.image}" alt="">
      <div class="col-md-4 col-md-offset-2 price-container">
        <span class="product-title">${product.name}</span>
        <span class="product-price"><del>¥${product.marketPrice}</del></span>
        <span class="product-price">¥${product.shopPrice}</span>
        <form class="form-inline">
          <div class="form-group">
            <label for="num">商品数量：</label>
            <input type="number" class="form-control" id="num">
          </div>
        </form>
        <div class="product-option">
          <a class="add-to-cart" onclick="addItem()">加入购物车</a>
        </div>
      </div>
    </div>
    <div class="row product-detail-container">
      <span class="product-detail-title">商品详情</span>
      <div class="product-detail-info">
        ${product.desc}
      </div>
    </div>
  </section>
  <!-- 底部 -->
  <jsp:include page="footer.jsp"/>
<script>
  function addItem() {
    var num = parseInt($('#num').val());
    if (isNaN(num) || num <= 0) {
      alert("商品数量至少为1")
      return
    }
    $.post('${pageContext.request.contextPath}/cart/addItem', {pid:${product.id}, num: num}, function (result) {
      console.log(result);
      if(result.code === 0){
        alert('请登录以后在选购商品')
      }else {
        alert("添加成功");
      }
    });
  }
</script>
</body>

</html>